<template>
    <div class="jczq">
        <d-header title='竞彩足球'><router-link class="back-home-icon" to='/'></router-link></d-header>	
        <div class="container has-header">
            <div class="banner" style="height:120px;background:#f90">
                <d-banner></d-banner>
            </div>
            <div class="communal-nav">
            	<dl>
            		<dd :class='currType=="rqspf"?"active":""' @click='currType="rqspf"'>
            			<span>让球胜平负</span>
            		</dd>
            		<dd :class='currType=="spf"?"active":""' @click='currType="spf"'>
            			<span>胜平负</span>
            		</dd>
            		<dd :class='currType=="bf"?"active":""' @click='currType="bf"'>
            			<span>比分</span>
            		</dd>
            		<dd :class='currType=="jq"?"active":""' @click='currType="jq"'>
            			<span>总进球</span>
            		</dd>
            		<dd :class='currType=="bqc"?"active":""' @click='currType="bqc"'>
            			<span>半全场</span>
            		</dd>
            	</dl>
            </div>
            <div class="sports-details">
            	<div class="lottery-list">
            		<ul>
            			<li>
            				<div class="lotto-info">
            					<div class="lotto-issue clearfix">
            						<div class="lotto-type">
            							<span class="pl-5">{{pid}}期</span>
            						</div>
            					</div> 
            					<div 
                                    :class="{'more-issue-btn':1,'active':pidListState}"
                                    @click='pidListState = !pidListState'
                                    >
            						<section>
            							<span>更多期次</span> 
            							<i class="c-arrow down"></i>
            						</section> 
            						<div class="opts">
            							<div class="opts-list">
            								<div v-for='(item,index) in pidList' :key='index' @click='changePid("jczq",item.did)'>{{item.did}}</div>
            							</div>
            						</div> 
            					</div>
            				</div>
            			</li>
            		</ul>
            	</div>
            	<div class="sports-main">
                    <div class="sports-table football">
                        <div class="sports-left">
                            <dl>
                                <dd>编号</dd>
                            </dl> 
                            <dl>
                                <dd v-for='(item,index) in data' :key='index'>{{item.cid}}</dd>
                            </dl>
                        </div> 
                        <div class="sports-right">
                            <div class="right-inner">
                                <dl>
                                    <dd>联赛</dd> <dd>主队</dd> <dd></dd> <dd>客队</dd> <dd>比分</dd> <dd>赛果</dd> 
                                    <!-- <dd>赔率</dd> -->
                                </dl> 
                                <dl v-for='(item,index) in data' :key='index'>
                                    <dd>{{item.title}}</dd> 
                                    <dd>{{item.hName}}</dd> 
                                    <dd>VS</dd> 
                                    <dd>{{item.gName}}</dd> 
                                    <dd>{{item.hScore+':'+item.gScore}}</dd> 
                                    <dd>{{item.sg[currType]}}</dd> 
                                    <!-- <dd>2.62</dd> -->
                                </dl>
                            </div>
                        </div>
                    </div>
                </div>

            	<div class="lotto-link entrance">
            		<dl class="clearfix">
            			<dd @click='goZx'>资讯</dd> 
                        <dd @click='gowf'>玩法</dd>
            		</dl>
            	</div>
            </div>
        </div>	
    </div>
</template>
<script>
import dHeader from '@/components/header'
import dBanner from "@/components/banner"
import {PidListJczq} from "@/request/api"
import {get} from "@/request/http"
import {getMatchRT,getMatchRS} from '@/assets/js/layout'
export default {
  name: 'detail',
  components: {
    dHeader,
    dBanner
  },
  data(){
    return {
        pid:'',
        pidList:[],
        data:[],
        pidListState:false,
        currType:'rqspf'
    }
        
  },
  methods:{
        getPidListJczq(){
            PidListJczq().then(v=>{
                this.pidList = v.rows.row || [];
            })
        },
        changePid(id,pid){
            this.getData(id,pid);
        },
        getData(id,pid){
            let _this = this;
            _this.pid = pid;
            get('/cpdata/match/'+id+'/award/'+pid+'/'+pid+'.json?_='+Math.random())
            .then(v=>{
                let datas = v.rows.row; 
                let arrs = [];
                datas.forEach((r,index)=>{
                    var mname = r.mname;
                    var sn = r.sn;
                    var mn = r.mn;
                    var time = r.mt.substring(5,16);
                    var ms = r.ms;
                    var ss = r.ss;
                    var hms = r.hms;
                    var hss = r.hss;
                    var cid = r.cid;
                    var ic = r.ic;
                    var cl = r.cl;
                    var lose = r.lose;
                    if(ic == 1){
                        if(lose == 0){

                        }else{

                        }
                    }else{
                        if((""+hss).length > 0 && (""+hms).length > 0 && (""+ss).length > 0 && (""+ms).length > 0){
                            var arr = [];
                            arr.push([getMatchRS("90", ms, ss, hms, hss, lose)]); //胜平负
                            arr.push([getMatchRS("91", ms, ss, hms, hss, lose)]); //猜比分
                            arr.push([getMatchRS("92", ms, ss, hms, hss, lose)]);//半全场
                            arr.push([getMatchRS("93", ms, ss, hms, hss, lose)]);//进球数
                            arr.push([getMatchRS("72", ms, ss, hms, hss, lose)]);//让球胜平负

                            var spf = getMatchRT("90",arr[0][0]);
                            var bf = getMatchRT("91", arr[1][0]);
                            var bqc = getMatchRT("92",arr[2][0]);
                            var jq = getMatchRT("93",arr[3][0]);
                            var rqspf = getMatchRT("72",arr[4][0]);
                        }else{
                            var spf = '-';
                            var bf = '-';
                            var bqc =  '-';
                            var jq = '-';
                            var rqspf =  '-';
                        }
                        let obj = {
                            cid:r.cid,
                            hName:r.mn,
                            gName:r.sn,
                            title:r.mname,
                            hScore:r.ms,
                            gScore:r.ss,
                            sg:{
                                spf,
                                jq,
                                bf,
                                rqspf,
                                bqc
                            }
                        }
                        arrs.push(obj)
                    }
                })
                _this.data = arrs;
            })
        },
        goZx(){
            this.$router.push('/information/01')
        },
        gowf(){
            this.$router.push('/explain/70&竞彩足球')
        }
  },
  created(){
    this.getPidListJczq();
    this.pid = this.$route.params.pid;
    this.getData('jczq',this.pid)
  }
};

</script>
<style lang="less" scoped>
@import '../../assets/style/detailjc.less';
</style>